{"id":15305114,"url":"https://github.com/eddyverbruggen/nativescript-webview-utils","last_synced_at":"2025-07-24T11:35:08.966Z","repository":{"id":56023272,"uuid":"109484258","full_name":"EddyVerbruggen/nativescript-webview-utils","owner":"EddyVerbruggen","description":"🕸Add request headers to a NativeScript WebView. Perhaps more utils later.","archived":false,"fork":false,"pushed_at":"2021-05-11T17:21:27.000Z","size":2269,"stargazers_count":20,"open_issues_count":8,"forks_count":17,"subscribers_count":2,"default_branch":"master","last_synced_at":"2025-05-18T18:51:45.393Z","etag":null,"topics":["headers","nativescript","nativescript-plugin","request-header","webview"],"latest_commit_sha":null,"homepage":"","language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"apache-2.0","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/EddyVerbruggen.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null}},"created_at":"2017-11-04T10:02:08.000Z","updated_at":"2024-05-30T16:03:50.000Z","dependencies_parsed_at":"2022-08-15T11:40:20.768Z","dependency_job_id":null,"html_url":"https://github.com/EddyVerbruggen/nativescript-webview-utils","commit_stats":null,"previous_names":[],"tags_count":11,"template":false,"template_full_name":null,"purl":"pkg:github/EddyVerbruggen/nativescript-webview-utils","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EddyVerbruggen%2Fnativescript-webview-utils","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EddyVerbruggen%2Fnativescript-webview-utils/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EddyVerbruggen%2Fnativescript-webview-utils/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EddyVerbruggen%2Fnativescript-webview-utils/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/EddyVerbruggen","download_url":"https://codeload.github.com/EddyVerbruggen/nativescript-webview-utils/tar.gz/refs/heads/master","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/EddyVerbruggen%2Fnativescript-webview-utils/sbom","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":259905335,"owners_count":22929915,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["headers","nativescript","nativescript-plugin","request-header","webview"],"created_at":"2024-10-01T07:59:08.976Z","updated_at":"2025-06-15T00:33:10.117Z","avatar_url":"https://github.com/EddyVerbruggen.png","language":"TypeScript","readme":"# NativeScript WebView Utils plugin\nAdd request headers to a NativeScript WebView. Perhaps more utils later.\n\n[![Build Status][build-status]][build-url]\n[![NPM version][npm-image]][npm-url]\n[![Downloads][downloads-image]][npm-url]\n[![Twitter Follow][twitter-image]][twitter-url]\n\n[build-status]:https://travis-ci.org/EddyVerbruggen/nativescript-webview-utils.svg?branch=master\n[build-url]:https://travis-ci.org/EddyVerbruggen/nativescript-webview-utils\n[npm-image]:http://img.shields.io/npm/v/nativescript-webview-utils.svg\n[npm-url]:https://npmjs.org/package/nativescript-webview-utils\n[downloads-image]:http://img.shields.io/npm/dm/nativescript-webview-utils.svg\n[twitter-image]:https://img.shields.io/twitter/follow/eddyverbruggen.svg?style=social\u0026label=Follow%20me\n[twitter-url]:https://twitter.com/eddyverbruggen\n\n\u003e For NativeScript versions older than 7, use a plugin version older than 4.0.0. \n\n\u003cimg src=\"https://raw.githubusercontent.com/EddyVerbruggen/nativescript-webview-utils/master/media/ios-headers.png\" width=\"300px\"/\u003e\n\n## Installation\nFrom the command prompt go to your app's root folder and execute:\n\n```\ntns plugin add nativescript-webview-utils\n```\n\n## Usage\n\n### Demo app (XML + TypeScript)\nYou can run [the demo app](https://github.com/EddyVerbruggen/nativescript-webview-utils/tree/master/demo) from the root of the project by typing `npm run demo.ios` or `npm run demo.android`.\n\n## API\n\n### `addHeaders`\nIf you're loading a page that requires you to send additional headers (for security perhaps),\nthis function allows you to dynamically inject those to any links within the webview.\n\n#### NativeScript with Angular\n\n```html\n\u003cWebView [src]=\"someSource\" (loaded)=\"webViewLoaded($event)\"\u003e\u003c/WebView\u003e\n```\n\n```typescript\nimport { EventData } from \"tns-core-modules/data/observable\";\nimport { WebView } from \"tns-core-modules/ui/web-view\";\nimport { WebViewUtils } from \"nativescript-webview-utils\";\n\nexport class MyComponent {\n  someSource: string = \"https://httpbin.org/headers\";\n\n  webViewLoaded(args: EventData): any {\n    const webView: WebView = \u003cWebView\u003eargs.object;\n    const headers: Map\u003cstring, string\u003e = new Map();\n    headers.set(\"Foo\", \"Bar :P\");\n    headers.set(\"X-Custom-Header\", \"Set at \" + new Date().toTimeString());\n    WebViewUtils.addHeaders(webView, headers);\n  }\n}\n```\n\n#### NativeScript with XML\n\n```xml\n\u003cWebView id=\"webviewWithCustomHeaders\" loaded=\"webViewLoaded\" height=\"360\" src=\"https://httpbin.org/headers\"/\u003e\n```\n\n```typescript\n// then add a few headers in the associated JS / TS file like this:\nimport { WebViewUtils } from 'nativescript-webview-utils';\nimport { WebView } from 'tns-core-modules/ui/web-view';\nimport * as observable from 'tns-core-modules/data/observable';\n\nexport function webViewLoaded(args: observable.EventData) {\n  const wv: WebView = \u003cWebView\u003eargs.object;\n  const headers: Map\u003cstring, string\u003e = new Map();\n  headers.set(\"Foo\", \"Bar :P\");\n  headers.set(\"X-Custom-Header\", \"Set at \" + new Date().toTimeString());\n  WebViewUtils.addHeaders(wv, headers);\n}\n```\n\n### `setUserAgent`\nThis method was removed in 2.0.0 because it caused bugs when `addHeaders` was used as well.\n\nYou should now use `addHeaders` and set the `User-Agent` header:\n\n```typescript\nimport { WebViewUtils } from 'nativescript-webview-utils';\nimport { WebView } from 'tns-core-modules/ui/web-view';\nimport * as observable from 'tns-core-modules/data/observable';\n\nexport function webViewForUserAgentLoaded(args: observable.EventData) {\n  const wv: WebView = \u003cWebView\u003eargs.object;\n  const headers: Map\u003cstring, string\u003e = new Map();\n  headers.set(\"User-Agent\", \"My Awesome User-Agent!\"); // this line!\n  WebViewUtils.addHeaders(wv, headers);\n}\n```\n\n## Credits\nQuite some code was borrowed from [this repo](https://github.com/okmttdhr/nativescript-webview-custom-header).\n","funding_links":[],"categories":[],"sub_categories":[],"project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feddyverbruggen%2Fnativescript-webview-utils","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Feddyverbruggen%2Fnativescript-webview-utils","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Feddyverbruggen%2Fnativescript-webview-utils/lists"}