微信小程序跳转到其他网页(外部链接)

微信小程序跳转到其他网页(外部链接)个人类型和海外类型的小程序不支持web-view标签也就是说个人申请的小程序,就别想跳转了!!!!1.开发的时候,我们难免碰到要跳转到其他网页中去那该怎么实现呢?2.例如我想点击一个按钮,跳转到百度(百度的网页还是在小程序中打开)3.wxml1.index.wxml(按钮页面)<viewclass=’wrapper’><b…

大家好,又见面了,我是你们的朋友全栈君。

个人类型和海外类型的小程序不支持 web-view 标签  也就是说个人申请的小程序,就别想跳转了!!!!

重磅消息 小程序逐渐会支持分享链接到朋友圈 点击下方链接前往查看演示地址

分享朋友圈文章地址:https://blog.csdn.net/qq_32113629/article/details/107177622

演示地址:

微信小程序跳转到其他网页(外部链接)

1.开发的时候,我们难免碰到要跳转到其他网页中去那该怎么实现呢?

2.例如我想点击一个按钮,跳转到百度(百度的网页还是在小程序中打开) 

3.wxml

   1. index.wxml   (按钮页面)

<view class='wrapper'>
    <button class='wepay' bindtap='goBaidu'>点击跳转</button>
  </view>

   2.out.wxml  (百度页面),

<web-view src="https://www.baidu.com/"></web-view>
//放心你没有看错就这么一行就行了//把你要跳转的界面用src 就可以了,以后要跳转到哪,src里面地址就写哪!

    3.别忘了,要在app.json中配置一下路由,

"pages":[
    "pages/a/a",
    "pages/b/b"
  ],

    电脑上是可以跳转的,体验版的话,在手机上是不好使的,除非你已经在小程序后台完成了配置域名,但是!!!!

注意!!这是顶级注释请看第四条

4.需要配置业务域名并上传验证文件:

这是我的vx公众号全是技术文章:微信小程序跳转到其他网页(外部链接)

这个是我本人的前端技术QQ交流群微信小程序跳转到其他网页(外部链接)

 

 

 

如果文章对你有帮助  希望各位可以给我的群 冲冲人气 

4.1校验文件需要放在你要跳转到的网站的根目录下面才可以!!!也就是说你想跳转到别人网站网页里面 需要得到别人的同意!!

那比如这个跳转到www.baidu.com 就是行不通的了,只能是自己在开发的时候玩玩(在开发者工具中点设置-项目设置-在不校验合法域名、web-view(业务域名)、TLS 版本以及 HTTPS 证书 前面打上对勾),在正式发布时候肯定是行不通的!!!

4.2那你想跳转到自己的网站中就需要配置域名、下载校验文件了!!再次强调 个人类型与海外类型的小程序暂不支持使用web-view

进入到小程序后台 https://developers.weixin.qq.com   设置-开发设置 -业务域名

微信小程序跳转到其他网页(外部链接)

微信小程序跳转到其他网页(外部链接)

4.3web-view 的 src可以是可打开关联的公众号的文章地址! (打开公众号这块也是个坑)

5.index.js

goBaidu:function(){
    wx.navigateTo({
      url:'../out/out', //
      success:function() {

      },       //成功后的回调;
      fail:function() { },         //失败后的回调;
      complete:function() { }      //结束后的回调(成功,失败都会执行)
 })

6.效果图

微信小程序跳转到其他网页(外部链接)微信小程序跳转到其他网页(外部链接)

 

 

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请联系我们举报,一经查实,本站将立刻删除。

发布者:全栈程序员-站长,转载请注明出处:https://javaforall.net/141361.html原文链接:https://javaforall.net

(0)
全栈程序员-站长的头像全栈程序员-站长


相关推荐

  • 40款帮助你加薪的IDEA神器插件![通俗易懂]

    写在前面的话:大家好,我是全栈小刘,一名零零后的编程爱好者。从初中开始编程,对编程有独特情怀,热爱技术,目前已有五年的编程经验,做过许许多多有意思的项目,这篇博客,算是对自己学习的一个总结,算是一份笔记,如果你对Java全栈感兴趣可以关注我的动态一起学习1.01的365次方=37.78343433289>>>10.99的365次方=0.02551796445…

    2022年4月17日
    101
  • 软件设计——UML建模-流程图、时序图、部署图

    在学习过程中,先整理自己看到的资料!如何绘制业务流程图:http://www.uml.org.cn/RequirementProject/201207111.aspUML建模之时序图(Sequence Diagram):http://www.cnblogs.com/ywqu/archive/2009/12/22/1629426.html【UML 建模】UML入门 之 交互图 – 时序图 协作图详解:

    2022年2月25日
    53
  • [Android] 【每日更新书源】「阅读」APP -100+ 精品书源一键导入!每天自动更新最新书源!…

    [Android] 【每日更新书源】「阅读」APP -100+ 精品书源一键导入!每天自动更新最新书源!…我特地写了个爬虫爬取书源,每天自动更新书源(URL是固定的)!大家也可以定期导入一下!放心!导入时会自动去除重复书源的!前段时间我发过一个书源大礼包的帖子,不过现在已经无法编辑修改了,所以我又开了一个新帖子,这次内容可不一样了!我上次说过想要自动抓取阅读官方公众号里分享的书源,结果结果公…

    2022年6月16日
    409
  • 欧式距离、标准化欧式距离、马氏距离、余弦距离

    欧式距离、标准化欧式距离、马氏距离、余弦距离目录欧氏距离标准化欧氏距离马氏距离夹角余弦距离汉明距离曼哈顿(Manhattan)距离1.欧式距离欧式距离源自N维欧氏空间中两点x1,x2x1,x2x_1,x_2间的距离公式:d=∑i=1N(x1i−x2i)2‾‾‾‾‾‾‾‾‾‾√d=∑i=1N(x1i−x2i)2d=\sum_{i=1}^N\sqrt{(x_{1i}-x_{2i})^2}2.标准化…

    2022年6月19日
    21
  • CSS 自动换行样式

    CSS 自动换行样式移动端经常会遇到屏幕被撑开的情况 下面是一些解决办法 方法一 你定死表格的宽度 即给表格一个宽度值 是数值 不是百分比 nbsp nbsp 方法二 强制不换行 div white space 不换行 normal 默认 nowrap 强制在同一行内显示所有文本 直到文本结束或者遭遇 br 对象 white space nowrap 方法三 自动

    2026年1月31日
    1
  • 腾讯和字节待遇_字节和腾讯哪个值得去

    腾讯和字节待遇_字节和腾讯哪个值得去分享我对两家互联网大厂的了解和主观感受大家好,我是鱼皮,最近这段时间,应该是正值大三的小伙伴最忙碌的时候,不少同学都在准备秋季校园招聘。我当时是通过暑期实习转正进入的腾讯,再加上之前也在字节跳动实习过,所以今天就分享下我对这两家互联网公司的了解和工作感受,希望能帮助大家选择,也可以给还在校园的小伙伴一些坚持的动力吧。工作感受接下来我会从多个方面来分享。由于公司很大,不同部门存在差异,所以工作感受比较主观,不代表整个公司的情况。薪资互联网公司的薪资还是挺高的。像我当时在字节跳动实习时.

    2022年10月6日
    3

发表回复

您的邮箱地址不会被公开。 必填项已用 * 标注

关注全栈程序员社区公众号