2017-01-07发表前端开发2 分钟读完 (大约261个字)

开发过程中，修改js和css，希望浏览器能够加载最新的代码，需要清除缓存，记录几种Chrome下的方法。

Chrome下清除浏览器缓存刷新页面的方法

开发者工具中禁用缓存选项

打开Chrome的开发者工具，Network下有个Disable cache选项，勾上即可。

浏览器关闭缓存选项

注意点：该选项只有在开发者工具保持打开状态有效。

浏览器插件：Cache Killer

安装浏览器插件，可以打开或者关闭。

cache killer

右键点击刷新按钮

右键点击刷新按钮，可出现三个选项：

正常重新加载
硬性重新加载
清除缓存并重新加载

重新加载选项

可选择“清除缓存并重新加载”，来清除全部缓存。

【全文完】

2017-01-07发表工具1 分钟读完 (大约158个字)

wordpress头像无法显示的问题解决

wordpress 4.7 中文版本中的gravatar头像已经由国外的转换为多说的头像，不过多说的头像仍然无法访问，导致页面加载速度变慢。

处理方法：

在functions.php文件中删除原来的获取多说头像的函数，并增加以下代码即可：

function get_avatar_deadwood( $avatar ) {
    $avatar = preg_replace( "/http:\/\/(www|\d).gravatar.com/","https://secure.gravatar.com",$avatar );
    return $avatar;
}
add_filter( 'get_avatar', 'get_avatar_deadwood' );

原理仍然是通过替换获取头像的链接，只是修改为gravatar的https链接。修改后的访问速度还不错。

【全文完】

2016-12-26发表前端开发1 分钟读完 (大约127个字)

angularjs中模态窗口$uibModal的数据回传问题

关于模态窗口的数据如何回传到主控制器中？

通过$uibModalInstance.close(data)来回传数据。
主控制器通过result回调接收即可。

代码实例如下：

app.controller("commonCtl", function ($scope, $uibModal) {
  $scope.openDialog = function () {
    var modalInstance = $uibModal.open({
      templateUrl: 'dialog.html',
      controller: 'formCtl',
      windowClass: 'window',
      size: 'lg',
      resolve: {
        data: function () {
          return $scope.data;
        }
      }
    });

    modalInstance.result.then(
      function (data) { // 关闭时回传过来的值（$uibModalInstance.close(data)）
        $scope.data = data;
      },
      function (reason) { // 取消时
        // 点击空白区域：backdrop click
        // 点击取消：cancel
      }
    );
  };
})

【全文完】

2016-12-24发表前端开发6 分钟读完 (大约918个字)

浏览器中的怪异模式和标准模式

在Web的早期，页面是有两个版本：一个是为Netscape Navigator而写，另一个是为微软IE。

当W3C制定Web标准时，浏览器并不能立即开始使用它们，因为这样做会破坏许多已经存在的网站。因此浏览器引入了两个模式来对待新标准兼容的站点和遗留下来旧的站点。

目前在浏览器上有三种用于布局引擎的模式：怪异模式(quirks mode)、近标准模式(almost stardards mode)和完全标准模式(full standards mode)。

在怪异模式下，布局模拟Navigator 4和IE5的非标准行为。

这对于支持在Web标准被广泛接受之前创建的站点是必须的。在完全标准模式中，行为是按照HTML和CSS规范中描述的。在近标准模式中，只有一小部分的怪异实现。

2016-12-23发表前端开发5 分钟读完 (大约722个字)

数据可视化中的几个基本概念

数据可视化中的几个基础概念解释。

维度

数据分析过程中经常使用的一个概念，分析数据的角度。主要是指数值、时间和文本。

图表类型

散点图

展示数据的分布

折线图

展示某一维度数据在时间上的规律或者趋势

柱形图

展示多个维度的比较和变化

饼图

展示一组数据的占比情况

2016-12-21发表工具1 分钟读完 (大约162个字)

Mac下远程控制方法

Mac远程控制其他Mac

Mac下远程控制其他Mac的方法记录：

方法一：VNC

在被控制的Mac下打开系统偏好设置-共享-远程管理,打开远程管理，另外一台Mac通过vnc连接。

另外一台Mac打开Finder, 输入CMD+K，打开连接服务器的界面，输入vnc://IP进行连接，连接成功
即可远程控制。

方法二：iMessage

未测试成功

方法三：Apple Remote Desktop

未测试

参考

Mac OS X 上有什么好的远程桌面操控软件吗？

【全文完】

2016-12-19发表前端开发2 分钟读完 (大约300个字)

AngularJS生产环境下的一些配置

记录AngularJS在生产环境下的一些配置，针对性能上的优化有帮助。

关闭调试数据

AngularJS默认会添加一些关于绑定、作用域到DOM节点，以及添加CSS类到数据绑定的元素。这些
信息主要是用于一些类似Protractor和
Batarang的工具使用。

生产环境下可关闭这些调试数据，以优化项目的性能，配置方法如下：

1
2
3

myApp.config(['$compileProvider', function ($compileProvider) {
  $compileProvider.debugInfoEnabled(false);
}]);

如果有需要调试，可以再浏览器的控制台中运行以下语句来打开：

1	angular.reloadWithDebugInfo();

关闭控制台的debug信息

一般我们会在代码中使用$log.debug()来添加控制台的调试信息，方便调试。一旦项目在生产环境下，这些
信息就不需要留给最终用户，因此可以选择关闭。

1
2
3

myApp.config(['$logProvider', function ($logProvider) {
  $$logProvider.debugEnabled(false);
}]);

说明：

该配置只是关闭debug级别的信息，debug以上的级别还是会在控制台输出，包括info,warn,error这些。

【全文完】

2016-12-18发表前端开发4 分钟读完 (大约604个字)

前端数据可视化库的选型

Web前端中有时会需要将数据通过图表的形式展示，而选择一个JavaScript的可视化库是比较重要的。
选择需要多个因素进行权衡，项目的需求、开发周期、人员的技术、文档、问题的解决、功能，下面是针对
github上星数较多的数据可视化库针对各角度做一下对比，方便后续的选型有所帮助。

2016-12-16发表前端开发几秒读完 (大约96个字)

使用browserSync作为开发环境使用HTML5模式的配置方法

使用browserSync自动热加载开发单页应用，启用AngularJS下的HTML5模式，相对路径的URL刷新会
提示无法获取请求。

安装connect-history-api-fallback包

1	npm install connect-history-api-fallback --save-dev

配置

在gulpfile.js文件中配置以下内容

var historyApiFallback = require('connect-history-api-fallback')
var bs = require('browser-sync').create();

bs.init({
   server: {
       baseDir: "./app",
       middleware: [ historyApiFallback() ]
    }
})

【全文完】

2016-12-14发表前端开发1 分钟读完 (大约161个字)

去掉AngularJS的URL中的#

默认的AngularJS项目开发中的URL访问路径中会有”#”作为前缀出现，可以通过配置将”#”去掉。

这里主要记录针对静态站点的设置，使用Nginx作为Web服务器的情况。

修改代码

修改html页面，增加base标签

<html>
<head>
  <base href="/">
</head>

...

</html

修改js文件中的html5Mode

angular
    .module('app.routes')
    .config(['$locationProvider', function($locationProvider) {
      $locationProvider.html5Mode(true);
    }]);

修改nginx配置

修改nginx的配置文件，增加try_files配置

server {
        listen 80;
        server_name example.com;
        location / {
            root $htdocs;
            try_files $uri $uri/ /index.html =404;
        }
}

Chrome下清除浏览器缓存刷新页面的方法

开发者工具中禁用缓存选项

浏览器插件：Cache Killer

右键点击刷新按钮

维度

图表类型

Mac远程控制其他Mac

方法一：VNC

方法二：iMessage

方法三：Apple Remote Desktop

参考

关闭调试数据

关闭控制台的debug信息

安装connect-history-api-fallback包

配置

修改代码

修改nginx配置

参考

链接

分类

最新文章

标签

归档