微信小程序使用webview打开第三方地址

这篇具有很好参考价值的文章主要介绍了微信小程序使用webview打开第三方地址。希望对大家有所帮助。如果存在错误或未考虑完全的地方,请大家不吝赐教,您也可以点击"举报违法"按钮提交疑问。

1、在page下创建一个webview目录文件包含index.js index.wxml,配置好路由
2、index.js

Page({
  data: {
    url: ""
  },
  onLoad(options) {
    if(options.url){
      this.setData({
        url: decodeURIComponent(options.url)
      })
    }
  },
})

3、index.wxml

<web-view src="{{url}}"></web-view>

4、跳转 (地址后拼接参数需要转码)

wx.navigateTo({
   url: "/pages/webview/index?url=" + encodeURIComponent(‘www.baidu.com’)
})

注意:webview页面的title 取得是第三方地址的title标签的内容,且webview页面不支持自定义标题文章来源地址https://www.toymoban.com/news/detail-695537.html

到了这里,关于微信小程序使用webview打开第三方地址的文章就介绍完了。如果您还想了解更多内容,请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章,希望大家以后多多支持TOY模板网!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处: 如若内容造成侵权/违法违规/事实不符,请点击违法举报进行投诉反馈,一经查实,立即删除!

领支付宝红包赞助服务器费用

相关文章

  • 微信小程序使用第三方ui组件库

    微信小程序使用第三方ui组件库

    第三方的ui组件有很多,本篇文章主要介绍Vant Weapp。 https://vant-contrib.gitee.io/vant-weapp/#/quickstart 先在微信开发者工具终端通过命令安装vant weapp: 通过 npm 安装 npm i @vant/weapp -S --production 通过 yarn 安装 yarn add @vant/weapp --production 安装 0.x 版本 npm i vant-weapp -S --production 安装vant weap

    2024年02月12日
    浏览(37)
  • 微信小程序使用nginx跳转第三方url

    微信小程序使用nginx跳转第三方url

    先在微信公众平台配置号域名   服务器域名和业务域名都配置好 然后微信小程序使用 web-view标签进行跳转 nginx配置:域名必须有ssl证书,不然还是访问不了 sub_filter如果nginx没装的话需要装一下 首先需要git安装 ngx_http_substitutions_filter_module git没安装:yum -y install git 安装了:

    2024年02月10日
    浏览(34)
  • 微信小程序使用webview打开pdf文档及显示网页内容

    微信小程序使用webview打开pdf文档及显示网页内容

    一、微信小程序根据接口返回的pdf链接,在小程序内部浏览pdf内容 需要用到微信小程序的两个api 下载资源到本地 wx.downloadFile wx.openDocument 前一个api下载资源到本地,后一个api打开pdf文档 二、根据网页链接,把网页内容在微信小程序内部显示 需要用到微信小程序的一个标签

    2024年02月09日
    浏览(10)
  • 微信小程序使用第三方组件wxParse加载富文本html

    微信小程序使用第三方组件wxParse加载富文本html

    微信小程序 微信小程序加载富文本html 微信小程序富文本第三方组件wxParse wxParse 富文本html wxParse 是一个微信小程序富文本解析组件,支持支持Html及markdown转wxml。 wxParse gitHub地址:https://github.com/icindy/wxParse 目前项目已停止维护了,原因未知。 按照gitHub上的指,下载demo之后,

    2024年02月12日
    浏览(33)
  • 微信小程序 - 完美解决 web-view 公众号文章或第三方网站分享转发后,打开提示 “无法打开该页面,不支持打开” 或 “页面不存在”(IOS 苹果系统打开是空白页,安卓系统会有提示)超详细排查

    微信小程序 - 完美解决 web-view 公众号文章或第三方网站分享转发后,打开提示 “无法打开该页面,不支持打开” 或 “页面不存在”(IOS 苹果系统打开是空白页,安卓系统会有提示)超详细排查

    由于出现这种问题的原因有很多种,绝对不像其他文章教程那样无效,本文提供了超级详细的排查思路与解决方案。 本文从 [初步排查] 到 [代码排查],完美解决 因各种原因导致 webview 页面分享后,用户打不开提示错误 这类问题, 您只需要按照排查步骤一步一步的走,从检

    2024年02月02日
    浏览(32)
  • 微信小程序 - 实现地图标点及导航功能,在地图上标记位置及第三方软件进行导航(无需授权,点击地址后直接打开地图并在地图上高亮标记位置、展示位置名称、详细地址,“去这里“ 可拉起外部第三方地图导航软件)

    微信小程序 - 实现地图标点及导航功能,在地图上标记位置及第三方软件进行导航(无需授权,点击地址后直接打开地图并在地图上高亮标记位置、展示位置名称、详细地址,“去这里“ 可拉起外部第三方地图导航软件)

    网上的代码都太乱了,各种乱七八糟的授权验证等,很多朋友不知道如何下手。 实现了微信小程序开发中,用户无需弹框授权就能打开地图高亮显示某个位置,并且支持导航和计算路程距离等, 例如,每个商家都有店铺位置,当点击地址时在地图中显示该位置并可一键导航

    2024年02月16日
    浏览(87)
  • uni-app 使用webview加载H5打开微信小程序

    uni-app 使用webview加载H5打开微信小程序

    最近公司有个需求要求在app里点击一个功能打开小程序,并且关闭小程序回到app,模仿平安保险app。 毕竟我也是刚学习uni-app,找了很多资料,找到了一个天天外链的网站可以生成一个小程序的链接,使用uni的webview去加载这个链接,很好,需求满足,但是收费,那能不能自己

    2023年04月18日
    浏览(25)
  • 如何在微信小程序里面使用npm安装第三方插件(以安装vant ui为例)

    如何在微信小程序里面使用npm安装第三方插件(以安装vant ui为例)

    1.在cmd里或者是终端里,找到对应的项目,并执行下面的命令,用来初始化package.json文件。 2.勾选下图选项 3.执行下面的命令安装vant ui 然后你会发现多了一个node_modules文件, 里面存的就是第三方组件。 4.最后一步,每次安装完一个新的第三方插件都要执行“构建npm” 执行完

    2024年02月14日
    浏览(33)
  • 微信小程序第三方登录

    目录 小程序第三方登录操作流程如下: 1.第一步 2.第二步 2.第三步 4.第四步 5.第五步 注意:如果第一步没打印出来,看看微信模拟器上的Id有没有更改,或则去源码试图,weixinId更改 进入uniapp官网=Api=第三方服务=登录=微信小程序登录 创建一个触发事件,获取头像和名称 调用

    2024年02月13日
    浏览(29)
  • 微信小程序--引用第三方组件

    微信小程序--引用第三方组件

    引用方式分为两种 1、使用npm安装 【方便更新 推荐】 2、直接引用dist文件 按需加载组件库中的组件可以使用 3、lin-ui 组件库中的配置 1、安装nodejs环境 2、使用命令行初始化package json文件 打开小程序根目录 使用npm init初始化 3、安装第三方组件 init之后打开小程序会发现多了

    2024年02月08日
    浏览(38)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

博客赞助

微信扫一扫打赏

请作者喝杯咖啡吧~博客赞助

支付宝扫一扫领取红包,优惠每天领

二维码1

领取红包

二维码2

领红包