safari

作者：gc(at)sysin.org，主页： www.sysin.org 请访问原文链接： https://sysin.org/article/install-macos-11-on-unsupported-mac/ ，查看最新版。转载请保留原文链接。 友情提示：安装系统前请备份数据！ 笔者测试一台 Mac mini 2012 later ，已经不在 Big Sur 官方支持列表，使用下面的方法，已经可以完美运行 Big Sur。 1. macOS Big Sur 正式版发布 macOS Big Sur 派新风貌， 一切任施展。 macOS Big Sur 将强大实力和优美外观的结合提升到一个崭新的高度。精心雕琢的全新设计，让你能淋漓尽致地感受 Mac 的魅力；Safari 浏览器迎来重大更新，待你饱览；地图 app 和信息 app 满载新功能，任你探索；更透明的隐私权限，保护也更周到。 macOS Big Sur 11.0 release date: 2020.11.11 2. 官方支持的列表 MacBook 2015 and later Learn more MacBook Air 2013 and later Learn more MacBook Pro Late 2013 and later Learn more Mac mini 2014 and later Learn

移动布局 1.移动设备有 手机和ipad 安卓系统 ios系统 安卓系统的内置浏览器是谷歌 ios内置 safari浏览器 他们的内核都是web，不考虑兼容性，需要考虑的问题是安卓和ios的区别？ 2.布局(写页面) 要考虑以下几点 设置的宽度 设备的实际大小（设备的分辨率）厂家给的 页面的大小 设计稿上的大小 浏览器的视口（大小）浏览器自带的可以通过用 document.documentElement.clientWidth 查看，在移动设备上如果不做视口处理默认是 980 例子：设备宽是320 页面宽是1200 浏览器视口是980px，三者不统一，我们用移动设备看页面，浏览器视口会自动缩放，以100%完整的展示页面，就会变得不清楚，特别挤。 第一我们需要把这个三个变得统一 1.移动设备宽(320) 要和浏览器视口宽一致 在head之间加一个meta标签 name=‘viewport’ <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" /> 设备宽度和浏览器视口一致时，如果页面大于这个数字，就会出现滚动条 2.当移动设备和浏览器视口一致时，如果还使用以前的布局，如果页面超过设备宽，超过的部分会被截掉

前言： 有时我们在使用requests抓取数据时得到的返回结果会与浏览器中看到的内容不一致，这是因为requests只能得到原始的HTML文挡，而浏览器的页面是通过javascript处理数据后生成的，这些数据的来源可能是Ajax加载的；可能是包含在HTML文档中的，也有可能是javascript+特定的算法生成的。 对于Ajax加载的页面：当你打开网站，原始页面中只会包含一部分数据，当这部分数据被加载后，会向服务器某个接口发送一个请求来请求数据，拿到数据后再由浏览器进行渲染得到小伙伴们看到的页面的全部内容（这里比如京东商场，当你搜索某个关键字时，会出现很多商品，当你的滚动条往下滑，商品信息才慢慢被加载出来！），而这个发送的请求就是Ajax 1、What is Ajax? 答：全称为：Asynchronous JavaScript and XML ，也就是异步加载的javascript 和 XML（通俗的讲：利用javascript在保证页面不被完全刷新、链接不改变的情况下于服务器交换数据并更新网页的一种方式） 2、基本原理(具体详解请参考W3Cschool上面的内容)http://www.w3school.com.cn/ajax/index.asp（官网） 工作流程： （1）、发送请求 （2）、解析内容 （3）、渲染网页得到结果 下面我们来具体分析下整个过程： 首先介绍下

跨域，指的是浏览器不能执行其他网站的脚本。它是由浏览器的同源策略造成的，是浏览器施加的安全限制。 所谓同源是指 域名、协议、端口均相同。 同源策略如下： URL 说明 是否允许通信 http://www.a.com/a.js 与 http://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.js 与 http://www.a.com/script/b.js 同一域名下不同文件夹 允许 http://www.a.com:8000/a.js 与 http://www.a.com/b.js 同一域名，不同端口 不允许 http://www.a.com/a.js 与 https://www.a.com/b.js 同一域名，不同协议 不允许 http://www.a.com/a.js 与 http://70.32.92.74/b.js 域名和域名对应ip 不允许 http://www.a.com/a.js 与 http://script.a.com/b.js 主域相同，子域不同 不允许 http://www.a.com/a.js 与 http://a.com/b.js 同一域名，不同二级域名（同上） 不允许（cookie这种情况下也不允许访问） http://www.cnblogs.com/a.js 与 http://www.a.com/b.js

本文借鉴 https://www.jianshu.com/p/6a25b18577eb ，感谢博主的分享。 本文主要讲解微信配置Universal Link问题，以及公司项目下多个app配置方案。 第一：更换的必要性 微信开发者平台，包括 QQ目前新建应用都必须配置 Universal Link ，老本版存量问题，微信开发者平台公告 2020年 3月起逐渐收回老版本功能。因此更新 ShareSDK配置 Universal Link 就是必须要做的。 第二： 自己配置的 Universal Link 步骤 1. 让后台人员准备一个https 的链接，供后面存放建好的apple-app-site-association 文件 2. 制作apple-app-site-association 文件，并放置在准备好的链接根目录下 3. 在App Store 对相应的buildID 开启 Universal Link 服务 4. 在Xcode 开启Associated Domains ，并填写对应Domains 5.用 GET请求测试该链接下的文件内容，并在 safari浏览器中测试 6. 填写微信新的LSApplicationQueriesSchemes 7.回调测试 第三步骤详解 1.准备 htttps链接，制作 apple-app-site-association文件

1、window的各种宽高 outerWidth、innerWidth、outerHeight、innerHeight outerHeight 获取浏览器窗口外部的高度（单位：像素）。表示整个浏览器窗口的高度，包括侧边栏（如果存在）、窗口镶边（window chrome）和调整窗口大小的边框（window resizing borders/handles） innerHeight 浏览器视口的高度（单位：像素），如果存在水平滚动条则包括它 outerWidth 获取浏览器窗口外部的宽度（单位：像素）。表示整个浏览器窗口的宽度，包括侧边栏（如果存在）、窗口镶边（window chrome）和调整窗口大小的边框（window resizing borders/handles） innerWidth 浏览器视口的宽度（单位：像素），如果存在垂直滚动条则包括它 下图中可以看到，outerWidth 和 outerHeight 不仅包含浏览器窗口的宽高，还包括窗口镶边 下图中可以看到，innerWidth和innerHeight，所谓的视口宽高不仅包含内容还包括padding 以上四个属性仅适用于 IE9+，对于老IE 则需注意两点： （1）、IE8及以下不支持 outerWidth 和 outerHeight，且没有提供替代的属性 （2）、针对 innerWidth 和

最近开发一款产品，要求PC端两列展示： 移动端展示： 使用display：flex布局，在最外面的wrap上添加overflow-y：auto；手机端使用媒体查询将两列宽度设为100%； 出现问题：当表格数据比较大时，PC端与安卓滚动条出现，滚动无问题，但是苹果IOS在表格里滑动无法触发滚动； 解决方法： 在滚动容器内加 -webkit-overflow-scrolling: touch 添加后偶尔会出现滑动不流畅，仔细查了-webkit-overflow-scrolling该属性 -webkit-overflow-scrolling 属性控制元素在移动设备上是否使用滚动回弹效果. auto : 使用普通滚动, 当手指从触摸屏上移开，滚动会立即停止。 touch : 使用具有回弹效果的滚动, 当手指从触摸屏上移开，内容会继续保持一段时间的滚动效果。继续滚动的速度和持续的时间和滚动手势的强烈程度成正比。同时也会创建一个新的堆栈上下文。 网上查了许多资料，具体有下面的几个坑： 在safari上，使用了-webkit-overflow-scrolling:touch之后，页面偶尔会卡住不动（本次问题） 通过动态添加内容撑开容器，结果根本不能滑动的bug（本次问题） 在safari上，点击其他区域，再在滚动区域滑动，滚动条无法滚动的bug（本次问题） 手势可穿过其他元素触发元素滚动

Fiddler的基本功能介绍： Fiddler是最强大最好用的Web调试工具之一，它能记录所有客户端和服务器的http和https请求，允许你监视，设置断点，甚至修改输入输出数据，Fiddler包含了一个强大的基于时间脚本的子系统，并且能使用.NET语言进行扩展。对HTTP协议越了解，就能越掌握Fiddler的使用方法。越使用Fiddler，就越能帮助了解HTTP协议。Fiddler无论对开发人员或者测试人员来说，都是非常有用的工具。 Fiddler的工作原理：Fiddler是以代理web服务器的形式工作的，它使用代理本地地址：127.0.0.1，端口xxxx，如下图所示。 能支持 HTTP代理的任意程序的数据包都能被 Fiddler嗅探到， Fiddler的运行机制就是本机上监听 Fiddler中设置的端口的 HTTP代理。 1 android 手机和fiddler连接： 下载地址：Fiddler.exe， http://www.telerik.com/download/fiddler 做开发需要抓取手机app的http/https的数据包，想看APP发出的http请求和响应是什么，这就需要抓包了，这可以得到一些不为人知的api，比如还可以干些“坏事”，比如那年微信发红包看照片，就通过接口抓包成功破解，不用发红包即可看照片。 需要工具：Fiddler抓包软件，下面介绍使用步骤