使用Sonarqube扫描Javascript代码的示例

使用sonarqube对javascript代码进行扫描，分析代码质量，最简单的方式莫过于使用缺省的sonar-way中的javascript的规则，使用sonar-scanner进行扫描，这篇文章通过最简单的例子，来进行说明。

事前准备

sonarqube

sonarqube可以使用docker版本快速搭建，可以参看一下easypack整理的镜像，具体使用可以参看如下链接，这里不再赘述：

环境假定

本文使用到的sonarqube为本机32003可以访问到的服务。版本为5.6.5

sonar-scanner

sonar-scanner详细信息如下：

liumiaocn:sonar liumiao$ sonar-scanner -v
info: scanner configuration file: /users/liumiao/desktop/sonar/sonar-scanner-3.2.0.1227-macosx/conf/sonar-scanner.properties
info: project root configuration file: /users/liumiao/sonar/sonar-project.properties
info: sonarqube scanner 3.2.0.1227
info: java 1.8.0_121 oracle corporation (64-bit)
info: mac os x 10.14 x86_64
liumiaocn:sonar liumiao$ 

项目目录构成

项目文件与目录构成信息如下：

liumiaocn:sonar liumiao$ tree
.
├── sonar-project.properties
└── src
  └── person.js
1 directory, 2 files
liumiaocn:sonar liumiao$

javascript源码

使用如下person.js的javascript源码，详细信息如下

liumiaocn:sonar liumiao$ cat src/person.js 
var person = function(first, last, middle) {
  this.first = first;
  this.middle = middle;
  this.last = last;
};
person.prototype = {
  whoareyou : function() {
    return this.first + (this.middle ? ' ' + this.middle: '') + ' ' + this.last;
  }
};
var a = nan;
if (a === nan) { // noncompliant; always false
 console.log("a is not a number"); // this is dead code
}
if (a !== nan) { // noncompliant; always true
 console.log("a is not nan"); // this statement is not necessarily true
}
for (var i = 0; i < strings.length; i--) {
 console.log("dead code")
}
if (str == null && str.length == 0) {
 console.log("string is empty");
}
liumiaocn:sonar liumiao$

sonar-project.properties设定文件

项目设定文件信息详细如下：

liumiaocn:sonar liumiao$ cat sonar-project.properties 
sonar.projectkey=javascript-prj
sonar.projectname=javascript demo project
sonar.projectversion=1.0
sonar.sources=src
sonar.host.url=http://127.0.0.1:32003
sonar.login=admin
sonar.password=admin
liumiaocn:sonar liumiao$

执行sonar-scanner

liumiaocn:sonar liumiao$ pwd
/users/liumiao/sonar
liumiaocn:sonar liumiao$ ls
sonar-project.properties src
liumiaocn:sonar liumiao$ sonar-scanner
info: scanner configuration file: /users/liumiao/desktop/sonar/sonar-scanner-3.2.0.1227-macosx/conf/sonar-scanner.properties
info: project root configuration file: /users/liumiao/sonar/sonar-project.properties
info: sonarqube scanner 3.2.0.1227
info: java 1.8.0_121 oracle corporation (64-bit)
info: mac os x 10.14 x86_64
info: user cache: /users/liumiao/.sonar/cache
info: sonarqube server 5.6.5
info: default locale: "en_us", source code encoding: "utf-8" (analysis is platform dependent)
info: load global repositories
info: load global repositories (done) | time=129ms
info: user cache: /users/liumiao/.sonar/cache
info: load plugins index
info: load plugins index (done) | time=3ms
info: process project properties
info: load project repositories
info: load project repositories (done) | time=126ms
info: load quality profiles
info: load quality profiles (done) | time=41ms
info: load active rules
info: load active rules (done) | time=609ms
warn: scm provider autodetection failed. no scm provider claims to support this project. please use sonar.scm.provider to define scm of your project.
info: publish mode
info: ------------- scan javascript demo project
info: load server rules
info: load server rules (done) | time=73ms
info: base dir: /users/liumiao/sonar
info: working dir: /users/liumiao/sonar/.scannerwork
info: source paths: src
info: source encoding: utf-8, default locale: en_us
info: index files
info: 1 files indexed
info: quality profile for js: sonar way
info: jacocosensor: jacoco report not found : /users/liumiao/sonar/target/jacoco.exec
info: jacocoitsensor: jacoco it report not found: /users/liumiao/sonar/target/jacoco-it.exec
info: sensor lines sensor
info: sensor lines sensor (done) | time=11ms
info: sensor javascriptsquidsensor
info: 1 source files to be analyzed
info: sensor javascriptsquidsensor (done) | time=200ms
info: 1/1 source files have been analyzed
info: sensor scm sensor
info: no scm system was detected. you can use the 'sonar.scm.provider' property to explicitly specify it.
info: sensor scm sensor (done) | time=0ms
info: sensor org.sonar.plugins.javascript.lcov.utcoveragesensor
info: sensor org.sonar.plugins.javascript.lcov.utcoveragesensor (done) | time=0ms
info: sensor org.sonar.plugins.javascript.lcov.itcoveragesensor
info: sensor org.sonar.plugins.javascript.lcov.itcoveragesensor (done) | time=0ms
info: sensor zero coverage sensor
info: sensor zero coverage sensor (done) | time=7ms
info: sensor code colorizer sensor
info: sensor code colorizer sensor (done) | time=0ms
info: sensor cpd block indexer
info: defaultcpdblockindexer is used for js
info: sensor cpd block indexer (done) | time=20ms
info: calculating cpd for 1 files
info: cpd calculation finished
info: analysis report generated in 53ms, dir size=13 kb
info: analysis reports compressed in 17ms, zip size=6 kb
info: analysis report uploaded in 29ms
info: analysis successful, you can browse http://127.0.0.1:32003/dashboard/index/javascript-prj
info: note that you will be able to access the updated dashboard once the server has processed the submitted analysis report
info: more about the report processing at http://127.0.0.1:32003/api/ce/task?id=awcnw2jutv5bsl-6uv7v
info: ------------------------------------------------------------------------
info: execution success
info: ------------------------------------------------------------------------
info: total time: 3.719s
info: final memory: 19m/278m
info: ------------------------------------------------------------------------
liumiaocn:sonar liumiao$ 

确认结果

代码扫描整体结果

详细代码级别的扫描结果展示

总结

以上就是这篇文章的全部内容了，希望本文的内容对大家的学习或者工作具有一定的参考学习价值，谢谢大家对的支持。如果你想了解更多相关内容请查看下面相关链接