关于小程序的内嵌其他网页

web-view

微信小程序:

承载网页的容器。会自动铺满整个小程序页面,个人类型的小程序暂不支持使用。

其中一些具体的属性和接口,可以看微信小程序官方文档

https://developers.weixin.qq.com/miniprogram/dev/component/web-view.html

一个简单的demo

wxml文件

<web-view src="https://www.baidu.com/"></web-view>

效果:

支付宝小程序:

html

<!-- API-DEMO page/component/webview/webview.axml -->
<view class="page">
  <web-view src="https://render.alipay.com/p/s/web-view/index" onMessage="onmessage"></web-view>
</view>

  js

// API-DEMO page/component/webview/webview.js
Page({
  data: {},
   onShareAppMessage(options) {
    my.alert({content:JSON.stringify(options.webViewUrl)});
    return {
      title: ‘分享 web-View 组件‘,
      desc: ‘View 组件很通用‘,
      path: ‘page/component/component-pages/webview/baidu‘,
      ‘web-view‘: options.webViewUrl,
    };
  },
  onmessage(e){
    my.alert({
      content: ‘拿到数据‘+JSON.stringify(e), // alert 框的标题
    });
  }
});

  

具体属性可以看官方文档:

https://docs.alipay.com/mini/component/web-view

原文地址:https://www.cnblogs.com/shubo168/p/12095986.html

时间: 2024-10-07 22:04:46

关于小程序的内嵌其他网页的相关文章

测试了小程序的内嵌网页总结几点

11月2日深夜微信团队宣布小程序内嵌页面开放了,很多开发者已经测试了小程序的内嵌网页,他们总结了以下几点: 1.内嵌网页的域名需要在小程序管理后台设置为业务域名,也就是需要先加入白名单 一个小程序最多可以添加 20 个业务域名,且一年只可修改 50 次业务域名. 2.内嵌的网页用起来跟微信内打开体验差不多,下拉也会显示“网页由 XX 域名提供” 3.内嵌的网页可以播放视频,但是视频必须是在白名单域名内的 我测试把视频放在七牛,就无法播放,一直在加载中. 4.内嵌的网页可以嵌入 iframe,而且

小程序 webView 内嵌h5

前端时间搞了小程序跑h5的流程,趁着这段稍微空闲的时间整理下,和大家一起分享下 1.内嵌h5,小程序场景判断 wx.miniprogram.getev(fn)  ,   该方法是微信提供的api,注意的是,该方法是异步的 .引用微信的JS-SDK版本要相应版本(推荐用JSSDK 1.3.2或者以上),否则会出现方法不存在,或者其他问题. 2 web-view 中转,写个公用跳转页面(用的是wepy框架) <template> <web-view src="{{pageUrl}}

7.PL_SQL——在PL_SQL程序中内嵌查询语句、DML语句和事物处理语句

在PL/SQL中可以使用的SQL语句主要有以下几类: SELECT 查询语句,DML语句,Transaction 事物处理语句,本文将对这几类语句在PL/SQL中的用法逐一介绍. 一.查询语句-SELECT SELECT 语句用来查询一条或多条语句.虽然SELECT 语句也属于DML语句,但SELECT是只读的,所以单独列出. 在PL/SQL中使用SELECT 语句的格式如下:   SELECT select_list INTO {variable_name[,variable_name]...

小程序分享进入H5动态网页

在要分享的界面加上这段代码 onShareAppMessage: function (options) { var that = this; // var return_url = that.data.shareWeb; var return_url = 'https://testapi.zhenaicx.com/activityH5/invite.html?1=1' var ol1 = return_url.split("?")[0] var ol2 = return_url.spl

java程序发送内嵌图片、带附件邮件

package mail; import java.io.UnsupportedEncodingException;import java.util.Properties; import javax.activation.DataHandler;import javax.activation.FileDataSource;import javax.mail.Authenticator;import javax.mail.Message;import javax.mail.MessagingExc

HTML阻止iframe跳转页面并使用iframe在页面内嵌微信网页版

昨天看到这篇文章[置顶]开源组件NanUI一周年 - 使用HTML/CSS/JS来构建.Net Winform应用程序界面 就想弄一个winform结合html5的一个小东西,突有兴致,想在里面嵌套一个微信网页版. 好了,想法一出来,就行动吧,最终效果如下图: 一开始就打算在页面里面嵌套一个iframe指向https://wx.qq.com就OK了,但是我还是太天真,微信网页版会自动跳转.结果如下图: 于是上网搜了一下阻止iframe跳转的办法,就是在iframe标签加上 security="r

[小工具]CSS内嵌样式自动提取器

逐行分析,将内联样式提取出来,并自动编号代替的一个小工具软件 注:style=""(此处必须是标准的双引号!) http://files.cnblogs.com/quejuwen/CssAuto.rar

微信内嵌H5网页 解决js倒计时失效

项目要求:将H5商城页面嵌套到公司微信公众号里 项目本身的开发跟移动端网页并无太多差异,只是这昨天遇到一个问题,说是棘手,到也简单. 用户下单后,在选择支付方式页面,有个倒计时的逻辑(从下单时开始计算,24小时后未支付,会有ws自动取消这个订单),js代码如下: 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 <script type="text/javascript"><br>  var 

app内嵌H5网页(webviewJavaScriptBridge)

摘要:使用的插件为webviewJavaScriptBridge,app端需要引入一下这个包,html页面只需一段JS代码 与IOS交互 <! 申明交互(此处代码固定) > function setupWebViewJavascriptBridge(callback) { if (window.WebViewJavascriptBridge) { return callback(WebViewJavascriptBridge); } if (window.WVJBCallbacks) { re